<template>
  <div :style="{ width: props.width, height: props.height }">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      :width="props.width"
      :height="props.height"
      preserveAspectRatio="none meet"
      viewBox="0 0 1826 29.047"
    >
      <g
        id="组_5099"
        data-name="组 5099"
        transform="translate(12902 19350.273)"
      >
        <g id="组_5097" data-name="组 5097">
          <path
            id="形状_545_拷贝"
            data-name="形状 545 拷贝"
            d="M-5.284,34.5H-297v-3H-6.575L14.767,8.953H148.88l11.936,13.133H385.609v3H159.489L147.552,11.953H16.058Z"
            transform="translate(-12605 -19359.227)"
            :fill="states.color"
          />
          <g
            id="组_4744"
            data-name="组 4744"
            transform="translate(-12853 -19683.227)"
          >
            <path
              id="形状_545_拷贝-2"
              data-name="形状 545 拷贝"
              d="M-135.15,25h-15V23h15Z"
              transform="translate(559 314)"
              :fill="states.color"
            />
            <path
              id="形状_545_拷贝-3"
              data-name="形状 545 拷贝"
              d="M-135.15,25h-15V23h15Z"
              transform="translate(672 314)"
              :fill="states.color"
            />
            <path
              id="形状_545_拷贝-4"
              data-name="形状 545 拷贝"
              d="M-60.15,25h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Zm-4,0h-2V23h2Z"
              transform="translate(578 314)"
              :fill="states.color"
            />
          </g>
          <circle
            id="椭圆_18"
            data-name="椭圆 18"
            cx="9"
            cy="9"
            r="9"
            transform="translate(-12581 -19339.227)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_18_-_轮廓"
            data-name="椭圆 18 - 轮廓"
            d="M9,2a7,7,0,1,0,7,7A7.008,7.008,0,0,0,9,2M9,0A9,9,0,1,1,0,9,9,9,0,0,1,9,0Z"
            transform="translate(-12581 -19339.227)"
            :fill="states.color"
          />
          <circle
            id="椭圆_19"
            data-name="椭圆 19"
            cx="9"
            cy="9"
            r="9"
            transform="translate(-12551 -19339.227)"
            :fill="states.color"
          />
          <circle
            id="椭圆_20"
            data-name="椭圆 20"
            cx="9"
            cy="9"
            r="9"
            transform="translate(-12522 -19339.227)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_20_-_轮廓"
            data-name="椭圆 20 - 轮廓"
            d="M9,2a7,7,0,1,0,7,7A7.008,7.008,0,0,0,9,2M9,0A9,9,0,1,1,0,9,9,9,0,0,1,9,0Z"
            transform="translate(-12522 -19339.227)"
            :fill="states.color"
          />
          <circle
            id="椭圆_21"
            data-name="椭圆 21"
            cx="9"
            cy="9"
            r="9"
            transform="translate(-12493 -19339.227)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_21_-_轮廓"
            data-name="椭圆 21 - 轮廓"
            d="M9,2a7,7,0,1,0,7,7A7.008,7.008,0,0,0,9,2M9,0A9,9,0,1,1,0,9,9,9,0,0,1,9,0Z"
            transform="translate(-12493 -19339.227)"
            :fill="states.color"
          />
          <circle
            id="椭圆_22"
            data-name="椭圆 22"
            cx="9.5"
            cy="9.5"
            r="9.5"
            transform="translate(-12220 -19345.227)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_22_-_轮廓"
            data-name="椭圆 22 - 轮廓"
            d="M9.5,2.5a7,7,0,1,0,7,7,7.008,7.008,0,0,0-7-7M9.5,0A9.5,9.5,0,1,1,0,9.5,9.5,9.5,0,0,1,9.5,0Z"
            transform="translate(-12220 -19345.227)"
            :fill="states.color"
          />
        </g>
        <g
          id="组_5098"
          data-name="组 5098"
          transform="translate(-11777 -19350.273)"
        >
          <path
            id="形状_545_拷贝-5"
            data-name="形状 545 拷贝"
            d="M93.893,34.5H385.609v-3H95.185L73.843,8.953H-60.27L-72.207,22.086H-297v3H-70.879l11.936-13.133H72.552Z"
            transform="translate(315.391 -8.953)"
            :fill="states.color"
          />
          <g
            id="组_4744-2"
            data-name="组 4744"
            transform="translate(115.15 4.047)"
          >
            <path
              id="形状_545_拷贝-6"
              data-name="形状 545 拷贝"
              d="M-150.15,25h15V23h-15Z"
              transform="translate(263.15 -23)"
              :fill="states.color"
            />
            <path
              id="形状_545_拷贝-7"
              data-name="形状 545 拷贝"
              d="M-150.15,25h15V23h-15Z"
              transform="translate(150.15 -23)"
              :fill="states.color"
            />
            <path
              id="形状_545_拷贝-8"
              data-name="形状 545 拷贝"
              d="M-150.15,25h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Zm4,0h2V23h-2Z"
              transform="translate(169.15 -23)"
              :fill="states.color"
            />
          </g>
          <circle
            id="椭圆_18-2"
            data-name="椭圆 18"
            cx="9"
            cy="9"
            r="9"
            transform="translate(362 11.047)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_18_-_轮廓-2"
            data-name="椭圆 18 - 轮廓"
            d="M9,2A7,7,0,1,1,2,9,7.008,7.008,0,0,1,9,2M9,0a9,9,0,1,0,9,9A9,9,0,0,0,9,0Z"
            transform="translate(362 11.047)"
            :fill="states.color"
          />
          <circle
            id="椭圆_19-2"
            data-name="椭圆 19"
            cx="9"
            cy="9"
            r="9"
            transform="translate(332 11.047)"
            :fill="states.color"
          />
          <circle
            id="椭圆_20-2"
            data-name="椭圆 20"
            cx="9"
            cy="9"
            r="9"
            transform="translate(303 11.047)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_20_-_轮廓-2"
            data-name="椭圆 20 - 轮廓"
            d="M9,2A7,7,0,1,1,2,9,7.008,7.008,0,0,1,9,2M9,0a9,9,0,1,0,9,9A9,9,0,0,0,9,0Z"
            transform="translate(303 11.047)"
            :fill="states.color"
          />
          <circle
            id="椭圆_21-2"
            data-name="椭圆 21"
            cx="9"
            cy="9"
            r="9"
            transform="translate(274 11.047)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_21_-_轮廓-2"
            data-name="椭圆 21 - 轮廓"
            d="M9,2A7,7,0,1,1,2,9,7.008,7.008,0,0,1,9,2M9,0a9,9,0,1,0,9,9A9,9,0,0,0,9,0Z"
            transform="translate(274 11.047)"
            :fill="states.color"
          />
          <circle
            id="椭圆_22-2"
            data-name="椭圆 22"
            cx="9.5"
            cy="9.5"
            r="9.5"
            transform="translate(0 5.047)"
            fill="rgba(255,255,255,0)"
          />
          <path
            id="椭圆_22_-_轮廓-2"
            data-name="椭圆 22 - 轮廓"
            d="M9.5,2.5a7,7,0,1,1-7,7,7.008,7.008,0,0,1,7-7M9.5,0A9.5,9.5,0,1,0,19,9.5,9.5,9.5,0,0,0,9.5,0Z"
            transform="translate(0 5.047)"
            :fill="states.color"
          />
        </g>
      </g>
    </svg>
  </div>
</template>

<script setup lang="ts">
import { computed, onMounted } from "vue";

let props = defineProps({
  width: {
    type: String,
    default: "",
  },
  height: {
    type: String,
    default: "",
  },
  id: {
    type: String,
    default: "",
  },
  models: {
    type: Object,
    default: () => ({}),
  },
});
const states = computed({
  get: () => props.models,
  set: () => {},
}) as any;
let emit = defineEmits(["updateSize"]);
onMounted(() => {
  states.value.ifTitle = true;
  emit("updateSize", {
    w: 1920,
    h: 80,
    id: props.id,
  });
});
</script>

<style scoped lang="scss"></style>
